<template>
    <div class="bigbox">
        <el-card class="box-card"> 
            <el-input
                placeholder="请输入内容"
                v-model="query.labelName"
                clearable
                style="width:200px"
                >
            </el-input>
            <el-button
                type="primary"
                icon="el-icon-search"
                @click="biaoqianType"
                >
            </el-button>
        </el-card>
         <el-card > 
             <span>政策资讯列表</span>
                <el-button
                    type="primary"
                    icon="el-icon-delete"
                    style="margin-left: 20px;"
                    size="small"
                    @click="handleDelete"
                >新增</el-button
                >
            <el-table :data="tableData" style="width: 100%">
            <el-table-column prop="logoPic" label="封面图" width="399" align="center"></el-table-column>
            <el-table-column prop="title" label="标题" width="399" align="center"></el-table-column>
            <el-table-column prop="introduction" label="导读" width="399" align="center"></el-table-column>
            <el-table-column prop="content" label="内容" width="399" align="center"></el-table-column>
            <el-table-column prop="isRec" label="是否推荐" width="399" align="center"></el-table-column>
            <el-table-column prop="releaseTime" label="内容" width="399" align="center"></el-table-column>
            <el-table-column label="操作" width="399" align="center">
               <template slot-scope="scope">
                <el-button @click="modify(scope.row)" type="text" size="small">修改</el-button>
                <el-button @click="godel(scope.row)" type="text" size="small">删除</el-button>
               </template>
            </el-table-column>
            </el-table>
        </el-card>
        <!-- 新增 -->
        <el-dialog
          title="新增"
          :visible.sync="dialogVisible"
          width="40%"
          >
          <el-form ref="form" :model="form" label-width="80px">
            <el-form-item label="标签名称">
                <el-input v-model="form.labelName"></el-input>
            </el-form-item>
             <el-form-item label="排序">
                <el-input v-model="form.sort"></el-input>
            </el-form-item>
          </el-form>
          <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="ok">确 定</el-button>
          </span>
        </el-dialog>
        <!-- 修改 -->
        <el-dialog
          title="修改"
          :visible.sync="dialogVisible1"
          width="40%"
          >
          <el-form ref="form" :model="forms" label-width="80px">
            <el-form-item label="标签名称">
                <el-input v-model="forms.labelName"></el-input>
            </el-form-item>
             <el-form-item label="排序">
                <el-input v-model="forms.sort"></el-input>
            </el-form-item>
          </el-form>
          <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible1 = false">取 消</el-button>
            <el-button type="primary" @click="ok1">确 定</el-button>
          </span>
        </el-dialog>
         <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="query.pageNum"
          :limit.sync="query.pageSize"
          @pagination="getList"
        />
    </div>
</template>

<script>
import { getList , getListup ,getListdel , getListrep} from '@/api/school/policy'
export default {
  name: '',
  data(){
    return {
        tableData:[],
        dialogVisible:false,
        dialogVisible1:false,
        form:{
          labelName:'',
          sort:''
        },
        forms:{
          labelName:'',
          sort:''
        },
        // 搜索
        query:{
          labelName:'',
          pageNum:'',
          pageSize:''
        },
        total:0
        
    }
  },
  components: {},
  created(){
    //   获取列表
    this.getList()
  },
  mounted(){
   
  },
  methods: {
    // 新增
    handleDelete(){
      this.dialogVisible = true 
      this.reset()
    },
    // 新增提交
    ok(){
        getListup(this.form).then(res=>{
            // console.log(res)
            if(res.code == 200){
                this.$message.success('新增成功')
                this.getList()
                this.dialogVisible = false 
            }
        })
    },
    // 修改
    modify(row){
        console.log(row)
        this.forms = row
        this.dialogVisible1 = true
    },
    // 修改提交
    ok1(){
        getListrep(this.forms).then(res=>{
            // console.log(res)
            if(res.code == 200){
                this.$message.success('修改成功')
                this.getList()
                this.dialogVisible1 = false 
            }
        })
    },
    // 删除
    godel(row){
      console.log(row.id);
      const id = row.id;
      this.$confirm("是否确认删除?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(function() {
          return getListdel(id);
        })
        .then(() => {
          this.getList();
          this.$message.success("删除成功");
        })
        .catch(function() {});
    },
    // 搜索
    biaoqianType(){
        this.getList()
    },
    // 获取老师列表
    getList(){
        getList(this.query).then(res=>{
            console.log(res)
            if(res.code ==200){
              this.tableData = res.rows
              this.total = res.total
            }
        })
    },
    // 表单重置
    reset() {
      this.form = {
         labelName:'',
         sort:''
      };
    },
  }
}
</script>
<style scoped>
.bigbox{
    padding:20px
}
.box-card{
    margin-bottom:20px
}
.el-table{
    margin-top:20px
}
</style>

